<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>使用Slot分发内容-单个Slot</title>
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>

<body>
    <div id="app">
        <demo></demo>
        <demo>
            <h3>别占位了，给我让开</h3>
        </demo>
    </div>

    <template id="sub-component">
      <div>
          <h2>子组件</h2>
          <slot>
            <h3>我是占位用的，没内容才会显示</h3>
          </slot>
      </div>
    </template>

    <script>
        Vue.component('demo', {
            template: '#sub-component'
        })
        new Vue({
            el: '#app'
        })
    </script>
</body>

</html>
